﻿<%@ Page Title="" Language="C#" MasterPageFile="~/Views/Shared/Site.Master" Inherits="System.Web.Mvc.ViewPage" %>

<asp:Content ID="Content1" ContentPlaceHolderID="TitleContent" runat="server">
	IUpload
</asp:Content>

<asp:Content ID="Content2" ContentPlaceHolderID="MainContent" runat="server">

    <script src="/Scripts/jquery-2.1.3.min.js" type="text/javascript"></script>
    <%--<script src="/Scripts/jquery.min.js" type="text/javascript"></script>--%>
    <script src="/Scripts/vn.eten.web.AjaxUploader.js" type="text/javascript"></script>

    
    Demo tính năng sử dụng ajax để upload file: <br />
<%--	<input type="file" id="f" /> 
	<input id="btn" type="button" value="upload" onclick="doUpload()" /> 
	<input id="btnCancel" type="button" value="Cancel" style="display: none"/>
	<span id="percent"></span>
	<div id="log"></div>
	<br/>&nbsp;<br/>--%>
	<br /> Try to upload
	<input type="file" id="FileUpload" multiple />
    <input type="button" id="Upload" value="Upload" />
<script type="text/javascript">
    function doUpload() {
        // kiem tra xem trinh duyet co ho tro ko
        if (vn.eten.web.AjaxUploader.isSupported()) {
            if (document.getElementById("f").files.length == 0) {
                alert("Bạn hãy chọn file!");
                return;
            }

            $('#f').hide();
            $("#btn").hide();

            new vn.eten.web.AjaxUploader({
                file: document.getElementById("f"),
                /*base: "./",*/
                /*service: "UploadSvr.ashx",*/
                /*bufferSize: 512 * 1024, // 0.5MB*/
                start: function(r) { // khi bat dau tao xong phien upload
                    $("#log").html(new Date() + ": start uploading!<br/>");
                    $("#percent").text("0%");
                    document.getElementById("btnCancel").onclick = function() {
                        r.cancel(); // nguoi dung yeu cau cancel upload
                        $("#log").append(new Date() + ": cancelling!<br/>");
                        $("#f").show();
                        $("#btn").show();
                        $(this).hide();
                    };
                    $("#btnCancel").show();
                },
                chunkDone: function(r) { // khi upload xong tung chunk
                    $("#log").append(new Date() + ": chunk done!<br/>");
                    $("#percent").text(r.percent + "%");
                },
                done: function() { // khi upload xong
                    $("#log").append(new Date() + ": finished!<br/>");
                    $("#f").show();
                    $("#btn").show();
                    $("#btnCancel").hide();
                },
                fail: function() { // khi upload that bai
                    $("#log").append(new Date() + ": interupted!<br/>");
                },
                finalize: function() { //  khi upload xong va cho` server xu ly file
                    $("#log").append(new Date() + ": finalizing!<br/>");
                },
                cancel: function() { // khi nguoi dung goi ham cancel
                    $("#log").append(new Date() + ": cancelled!<br/>");
                }
            }).start();
        }
        else
            alert("Trinh duyet khong ho tro");
    }

    $(document).ready(function() {
        $("#Upload").click(function() {
            var formData = new FormData();
            var totalFiles = document.getElementById("FileUpload").files.length;
            for (var i = 0; i < totalFiles; i++) {
                var file = document.getElementById("FileUpload").files[i];

                formData.append("FileUpload", file);
            }
            $.ajax({
                type: "POST",
                url: '/Ad/TryUpload',
                data: formData,
                dataType: 'json',
                contentType: false,
                processData: false,
                success: function(response) {
                    alert('succes!!');
                },
                error: function(error) {
                    alert("errror");
                }
            });
        });
    });
</script>
</asp:Content>
